<script setup>
//收藏页面
import "../assets/Release/iconfont.css"
import RecommendContent from "@/components/Recommend/RecommendContent.vue";
import {ref} from "vue";
import axios from "axios";
import router from "@/router/index.js";

const list = ref([])

function getCollectionArtList() {
  axios.get("http://127.0.0.1:8081/art/getCollectionArtList", {
    params: {
      uid: 1
    },
  }, {}).then(res => {
    console.log(res)
    list.value = res.data;
  }).catch(err => {
    console.log(err)//打印错误信息
  })
}

getCollectionArtList()
</script>

<template>
  <div class = "CollectionHeader">
    <span class = "CollectionHeader-left" @click = "router.back()">
      <i class = "iconfont icon-fanhui" />
    </span>
    <h3 style = "display:inline-block;width: 100%" class = "text-center">收藏</h3>
    <span class = "CollectionHeader-right">
      <i class = "iconfont icon-sousuo"></i>
    </span>
  </div>
  <div class = "border">
    <div style = "margin: 20px 0;" v-for = "(list,index) in list" :key = "index">
      <RecommendContent class = "RecommendContent" :title = "list.title" :id = "list.id"
                        :comment-num = "list.commentNum" :user = "list.user" :content = "list.content"
                        :like-count = "list.likeCount" :get-list = "list.getList"></RecommendContent>
    </div>
  </div>
</template>

<style scoped>
.CollectionHeader {
  position: relative;
}

.CollectionHeader-left {
  position: absolute;
  left: 0;
}

.CollectionHeader-right {
  position: absolute;
  right: 0;
}
</style>